<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>H+ 新手向导</title>
    <link rel="shortcut icon" href="../../content/static/img/favicon.ico">
    <link href="../../content/css/common_modal.css" rel="stylesheet">
    <link href="../../content/static/css/bootstrap.min.css?v=3.3.5" rel="stylesheet">
    <link href="../../content/static/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="../../content/static/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="../../content/static/css/animate.min.css" rel="stylesheet">
    <link href="../../content/static/css/style.min.css?v=4.0.0" rel="stylesheet">
    <link href="../../content/static/css/home.css?v=4.0.0" rel="stylesheet">
    <script src="../../content/js/iconfont.js"></script>
    <style>
        .fa-female:before {
            color: #fb7cd5;
        }
        .fa-location-arrow:before {
            color: rebeccapurple;
        }
        .fa-mobile-phone:before, .fa-mobile:before{
            color: black;
        }
        .fa-map-marker:before {
            color: #1ab394;
        }
        table-th{
            font-size: 12px;
            font-family: tahoma, "Microsoft YaHei", "Hiragino Sans GB", Arial, sans-serif;
            line-height: 1.42857143;
            color: #333;
            background-color: #f5f5f5;
        }      
        table tr{ height:40px;}  
        h3, h4, h5 {
            /* margin-top: 5px; */
            font-weight: initial;
        }
    </style>
</head>

<body class="content-container">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="content-wrapper" style="background: #F5F5F5">
                <div style="width: 100%;background: #fff;padding: 30px 30px;">
                    <div class="panel blank-panel">
                        <div class="panel-options">
                            <ul class="nav nav-tabs" style="font-size: 20px;">
                                <li class="active" style="text-align: center;width: 180px;"><a data-toggle="tab" href="#tab-1">初始资料</a>
                                </li>
                                <li class="" style="text-align: center;width: 180px;"><a data-toggle="tab" href="#tab-2" aria-expanded="false">进货</a>
                                </li>
                                <li class="" style="text-align: center;width: 180px;"><a data-toggle="tab" href="#tab-3">销售</a>
                                </li>
                                <li class="" style="text-align: center;width: 180px;"><a data-toggle="tab" href="#tab-4" aria-expanded="false">库存</a>
                                </li>
                                <li class="" style="text-align: center;width: 180px;"><a data-toggle="tab" href="#tab-5">财务</a>
                                </li>
                            </ul>
                        </div>
                        <div class="panel-body">
                            <div class="tab-content">
                                <div id="tab-1" class="tab-pane active">
                                    <form class="form-horizontal" novalidate="novalidate">
                                        <div class="form-group" style="margin-bottom:0px;text-align: center;">
                                            <!-- <div class="col-sm-4">
                                                <input class="fill-item timeChoose" placeholder="请输入或扫描商品编号/条形码/序列号"
                                                    type="text" style="border:2px solid #444" />
                                            </div>
                                         -->
                                            <h3>初始资料录入</h3>
                                            <h4>及时准确的录入仓库、商品、客户、供应商与结算账户信息，能够有效的保障经营数据的完整以及后期账务的核算。 </h4>
                                            <div class="page-panel-cont">
                                                <ul class="apply-list clearfix">
                                                    <li onclick="OpenPage('/bx/TempExpenseNew/AddTempExpenseIndex', '销售单录入')">
                                                        <a href="javascript:;">
                                                            <div class="icon-wrapper icon-wrapper3">
                                                                <svg class="icon" aria-hidden="true">
                                                                    <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-tiaozhengshixiangshenqingdan"></use>
                                                                </svg>
                                                            </div>
                                                            <p>销售单录入</p>
                                                        </a>
                                                    </li>
                                                    <li onclick="OpenPage('/bx/RepayTempExpense/AddIndex', '销售单退货单')">
                                                        <a href="javascript:;">
                                                            <div class="icon-wrapper icon-wrapper6">
                                                                <svg class="icon" aria-hidden="true">
                                                                    <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-jiekuanchanghuandan"></use>
                                                                </svg>
                                                            </div>
                                                            <p>销售单退货单</p>
                                                        </a>
                                                    </li>
                                                    <li onclick="OpenPage('/bx/RoleExpensesNew/TravelApplicantionAdd', '进货单录入')">
                                                        <a href="javascript:;">
                                                            <div class="icon-wrapper icon-wrapper1">
                                                                <svg class="icon" aria-hidden="true">
                                                                    <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-FK_Travel_claims"></use>
                                                                </svg>
                                                            </div>
                                                            <p>进货单录入</p>
                                                        </a>
                                                    </li>
                                                    <li onclick="OpenPage('/bx/ExpenseDisbursementNew/Add', '进货退货单')">
                                                        <a href="javascript:;">
                                                            <div class="icon-wrapper icon-wrapper2">
                                                                <svg class="icon" aria-hidden="true">
                                                                    <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-FK_Expense_reimburse"></use>
                                                                </svg>
                                                            </div>
                                                            <p>进货退货单</p>
                                                        </a>
                                                    </li>
                                                    <li onclick="OpenPage('/bx/ExpensePayment/AddPay', '借入单录入')">
                                                        <a href="javascript:;">
                                                            <div class="icon-wrapper icon-wrapper5">
                                                                <svg class="icon" aria-hidden="true">
                                                                    <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-FK_Expense_payment_f"></use>
                                                                </svg>
                                                            </div>
                                                            <p>借入单录入</p>
                                                        </a>
                                                    </li>
                                                    
                                                </ul>
            
                                            </div>
                                        </div>
                                    </form>
                                </div>
                                <div id="tab-2" class="tab-pane">
                                        <!-- <a class="revision-btn" href="javascript:;">导入商品信息</a> -->
                                    </div>
                                    <div id="tab-3" class="tab-pane">
                                            <!-- <a class="revision-btn" href="javascript:;">导入商品信息</a> -->
                                        </div>
                                        <div id="tab-4" class="tab-pane">
                                                <!-- <a class="revision-btn" href="javascript:;">导入商品信息</a> -->
                                            </div>
                                <div id="tab-5" class="tab-pane">
                                    <!-- <a class="revision-btn" href="javascript:;">导入商品信息</a> -->
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="../../content/js/lib/vue/vue.min.js"></script>
    <script src="../../content/static/js/jquery.min.js?v=2.1.4"></script>
    <script src="../../content/static/js/bootstrap.min.js?v=3.3.5"></script>
    <script src="../../content/static/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
    <script src="../../content/static/js/content.min.js?v=1.0.0"></script>
    <script src="../../content/js/lib/vue/vue-modal.js"></script>
    <script src="../../content/js/lib/vue/vue-pagination.js"></script>
    <script src="../../content/js/common.js"></script>
    <script src="../../content/js/lib/vue/select2.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#warehouse").select2({
                width: "220px"
            });
            $('.treeBtn').click(function () {
                if ($(this).hasClass('project')) {
                    $treeWrap = $('.projectTreeWrap');
                }
                var $this = $(this),
                    pos = $this.offset();
                if ($treeWrap.hasClass('none')) {
                    $treeWrap.css({
                        left: pos.left,
                        top: pos.top + $this.height()
                    }).removeClass('none');
                } else {
                    $treeWrap.addClass('none');
                }
            });
            $('.treeWrap .btn-wrap a').click(function (e) {
                var targetClass = e.target.className;
                if (targetClass.indexOf('btn-success') > -1) {
                    vm.projectId.paramId = vm.projectId.checkedId;
                    if (vm.projectId.paramId === '') {
                        $('.treeBtn.project').html('未选择').addClass('no-project');
                    } else {
                        $('.treeBtn.project').html('已选择').removeClass('no-project');
                    }
                }
                $('.treeWrap').addClass('none');
            });
        })
        var vmData = {
            addModal: {
                show: false,
                style: {
                    width: '980px',
                    height: "auto"
                },
                addClass: 'scroll-modal',
                func: {
                    type: Function
                },
                close: function () {
                    vm.addModal.show = false;
                }
            },
            detailModal: {
                show: false,
                style: {
                    width: '980px',
                    height: "auto"
                },
                addClass: 'scroll-modal',
                func: {
                    type: Function
                },
                close: function () {
                    vm.detailModal.show = false;
                }
            },
        };
        vmData = $.extend(vmData, baseData);
        var vmMothod = {
            init: function () {},
            addShow: function () {
                vm.addModal.show = true;
                vm.loadTree(1, 2, "#proTree");
                $('#file-es').fileinput({
                    language: 'zh',
                    uploadUrl: '#',
                    allowedFileExtensions: ['jpg', 'png', 'gif']
                });
                $('.tree').click(function () {
                    if ($(this).hasClass('project')) {
                        $treeWrap = $('.projectDetaiTreeWrap');
                    }
                    var $this = $(this),
                        pos = $this.offset();
                    if ($treeWrap.hasClass('none')) {
                        $treeWrap.css({
                            left: pos.left,
                            top: pos.top + $this.height()
                        }).removeClass('none');
                    } else {
                        $treeWrap.addClass('none');
                    }
                });
                $('.proTreeWrap .btn-wrap a').click(function (e) {
                    var targetClass = e.target.className;
                    if (targetClass.indexOf('btn-success') > -1) {
                        vm.projectId.paramId = vm.projectId.checkedId;
                        if (vm.projectId.paramId === '') {
                            $('.tree.project').html('未选择').addClass('no-project');
                        } else {
                            $('.tree.project').html('已选择').removeClass('no-project');
                        }
                    }
                    $('.proTreeWrap').addClass('none');
                });
                var testdataBsSuggest = $("#test_data").bsSuggest({
                    indexId: 2,
                    indexKey: 1,
                    data: {
                        "value": [{
                            "id": "0",
                            "word": "板",
                            "description": "板"
                        }, {
                            "id": "1",
                            "word": "包",
                            "description": "包"
                        }, {
                            "id": "2",
                            "word": "杯",
                            "description": "杯"
                        }, {
                            "id": "3",
                            "word": "袋",
                            "description": "袋"
                        }, {
                            "id": "4",
                            "word": "个",
                            "description": "个"
                        }, {
                            "id": "5",
                            "word": "公斤",
                            "description": "公斤"
                        }, {
                            "id": "6",
                            "word": "罐",
                            "description": "罐"
                        }, {
                            "id": "7",
                            "word": "毫升",
                            "description": "毫升"
                        }, {
                            "id": "8",
                            "word": "件",
                            "description": "件"
                        }, {
                            "id": "9",
                            "word": "斤",
                            "description": "斤"
                        }, {
                            "id": "10",
                            "word": "卷",
                            "description": "卷"
                        }, {
                            "id": "11",
                            "word": "卡",
                            "description": "卡"
                        }, {
                            "id": "12",
                            "word": "克",
                            "description": "克"
                        }, {
                            "id": "13",
                            "word": "粒",
                            "description": "粒"
                        }, {
                            "id": "14",
                            "word": "米",
                            "description": "米"
                        }, {
                            "id": "15",
                            "word": "瓶",
                            "description": "瓶"
                        }, {
                            "id": "16",
                            "word": "升",
                            "description": "升"
                        }, {
                            "id": "17",
                            "word": "双",
                            "description": "双"
                        }, {
                            "id": "18",
                            "word": "台",
                            "description": "台"
                        }, {
                            "id": "19",
                            "word": "套",
                            "description": "套"
                        }, {
                            "id": "20",
                            "word": "条",
                            "description": "条"
                        }, {
                            "id": "21",
                            "word": "筒",
                            "description": "筒"
                        }, {
                            "id": "22",
                            "word": "箱",
                            "description": "箱"
                        }, {
                            "id": "23",
                            "word": "张",
                            "description": "张"
                        }, {
                            "id": "24",
                            "word": "支",
                            "description": "支"
                        }],
                        "defaults": ""
                    }
                });

            },
        };
        vmMothod = $.extend(vmMothod, baseCommonFunction);
        var vm = new Vue({
            el: '.content-container',
            data: vmData,
            methods: vmMothod
        });
        vm.init();
    </script>
</body>

</html>